<template>
  <el-select filterable remote :remote-method="getOptions" remote-show-suffix :loading="loading">
    <el-option v-for="item in options" :key="item.company_id" :value="item.company_id" :label="item.name"></el-option>
  </el-select>
</template>

<script setup>
import { customerServer } from '@/api/customer'
import { ref } from 'vue';
const loading = ref(false);
const options = ref([]);
const getOptions = async (kw) => {
  kw = (kw || '').trim();
  // 如果没有输入关键字且已有选项，则不重新获取
  if (!kw && options.value.length) return;
  loading.value = true;
  try {
    const { data } = await customerServer.get({
      size: 30,
      keyword: (kw || '').trim(),
    });
    options.value = data?.data_list || [];
  } catch (error) {
    console.error('获取物业公司列表失败:', error);
  }
  loading.value = false;
};
getOptions();
</script>